<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>

<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">

<script type="text/javascript">
    $(function () {

        /**
         * 为导航栏绑定选择事件
         */
        $(".header-tabs li").removeClass("active");
        $("#${cateId==null?0:cateId}").addClass("active")


        //轮播图间隔时间
        $('.carousel').carousel({
            interval: 2000
        });

        /**
         * 为导航栏绑定选择事件
         */
        $(".nav-tabs li").click(function () {
            $(".nav-tabs li").removeClass("active");
            $(this).addClass("active");
        });
    });

    function submitSearchForm() {
        var keywords = $("#keywords").val();
        if("" == keywords.trim()){
            $("#keywords").val("java");
        }

        $("#searchForm").submit();
    }
</script>

<html>
<!--
    作者：offline
    时间：2018-10-29
    描述：top
-->
<jsp:include page="top.jsp"/>
<!--
    作者：offline
    时间：2018-10-29
    描述：logo search
-->
<div style="width:100%;height:420px;background:#f6f8fb;">
<img
			src="/img/bookCavity_main.png" style="height:270px;width:auto;z-index:999;position:absolute;left:62%;margin-top:60px;"
			alt="dd.com" />
<div class="container">
	
	<div style="padding-top:60px;"> 
	<h1 style="font-family:PingFangSC-Medium;font-size:34px;line-height:54px;">书洞-智能购书平台</h1> 
	<div style="color:#272a49;font-family:PingFangSC-Regular;font-size:14px;opacity:0.8;margin-top:24px;line-height:26px;" track-rich="true">
	书洞-智能购书平台，旨在为各类图书选购场景提供智能一体化解决方案。
	</div> 
	
	<div class="detail-box" style="margin-top:60px;"> 

	<button type="button" class="btn btn-info btn-circle btn-xl" style="height:50px;width:50px;border-radius:50px; margin-right:20px;"><i class="glyphicon glyphicon-thumbs-up"></i></button>
    <button type="button" class="btn btn-danger btn-circle btn-xl" style="height:50px;width:50px;border-radius:50px; margin-right:20px;"><i class="glyphicon glyphicon-thumbs-down"></i></button>

    </div> 
    </div>



    <div class="row" style="margin-top:60px;">
        <ul class="nav nav-tabs header-tabs">

            <li class="active" id="0"><a href="">首页</a></li>
            <c:forEach items="${bookCategories}" var="bookCat">
                <li id="${bookCat.cateId}"><a href="index/category/${bookCat.cateId}">${bookCat.name}</a></li>
            </c:forEach>

            <%--<li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                    文学 <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#">童书</a></li>
                    <li><a href="#">教辅</a></li>
                    <li><a href="#">EJB</a></li>
                    <li class="divider"></li>
                    <li><a href="#">分离的链接</a></li>
                </ul>
            </li>--%>
        </ul>
    </div>
</div>
</div>
<div style="height: 3px; background-color: #ff2832;"></div>
</html>
